<template>
    <div class="app-container">
        <!-- <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1565067852752&di=539f52a7ff86fdfb1aba616bbcca0821&imgtype=0&src=http%3A%2F%2Fb-ssl.duitang.com%2Fuploads%2Fitem%2F201711%2F30%2F20171130170814_NKfEQ.jpeg" style="width:100%" alt=""> -->
        <iframe v-if="flag==1" class="iframe" src="http://www.jq22.com/demo/jQuerySnow201711082128/" frameborder="0"></iframe>
        <iframe v-if="flag==2" class="iframe" src="http://www.jq22.com/demo/jQuery-xh-141222220140/" frameborder="0"></iframe>
        <iframe v-if="flag==110" class="iframe" src="http://www.jq22.com/demo/romeclock201905211205/" frameborder="0"></iframe>
        <iframe v-if="flag==4" class="iframe" src="http://www.jq22.com/demo/html5Csss201802041853/" frameborder="0"></iframe>
        <iframe v-if="flag==5" class="iframe" src="http://www.jq22.com/demo/html5Canvas201711011012/" frameborder="0"></iframe>
        <iframe v-if="flag==6" class="iframe" src="http://www.jq22.com/demo/html5-hudei20151104/" frameborder="0"></iframe>
        <iframe v-if="flag==3" class="iframe" src="http://www.jq22.com/demo/jquery-cloud-141217202931/" frameborder="0"></iframe>
    </div>
</template>

<script>
export default {
    name:"homePage",
    data() {
        return {
            flag:110
        };
    },
    created(){
        this.tiemFn()
    },  
    methods:{
        //times
        tiemFn(){
            let times = parseInt(Math.random()*10)
            if(times>6){
                this.flag = times  - 4
            }else{
                if(times>0){
                    this.flag = times
                }else{
                    this.flag = 5
                }
            }
        }
    }
  };
</script>
<style>
    .iframe{height: calc(100vh - 232px);width: 100%}
</style>